<template>
<div class="nav">
    <Menu mode="horizontal" :theme="theme1" active-name="1" @on-select="select" on-click="select">
        <MenuItem name="phone">
        手机
        </MenuItem>
        <MenuItem name="clothes">
        服饰
        </MenuItem>
        <MenuItem name="3">
        生鲜
        </MenuItem>
        <MenuItem name="4">
        图书
        </MenuItem>
        <Dropdown @on-click="onClick">
        <a href="javascript:void(0)" style="color:#ffffff">{{name}}</a>
        <DropdownMenu slot="list" >
            <DropdownItem name="set">设置</DropdownItem>
            <DropdownItem name="change">账号切换</DropdownItem>
            <DropdownItem name="logout">退出登录</DropdownItem>           
        </DropdownMenu>
    </Dropdown>
    </Menu>
    <div>

</div>
    <template>

</template>
    </div>
</template>
<script>
import service from '@/service'
import { mapState ,mapActions} from 'vuex'
    export default {
        name:'navbar',
        data () {
            return {
                name:'123',
                theme1: 'dark',
                picture:"",
                image:''
                
            }
        },
        methods:{
            ...mapActions(['getUserName']),
            select(name){
                 console.log(name)
                 this.$router.push({path:"/"+name})
            },
            onClick(name){
                console.log(name)
                service.post('/v1/logout')
                .then((res)=>{
                    console.log(res)
                    if(res.retcode===1){
                        this.$router.push({name:'Login'})
                    }
                })
            }


        },
        created(){
            service.get('/v1/getUser')
            .then((res)=>{
                console.log(res)
                this.name=res.userName
            })
            
        }

        
    }
</script>
<style lang>
    .ivu-menu-item-active,ivu-menu-item-selected{
        background: red;
    }

</style>
